<template>
	<view class="wmOrderDetails">
		<view class="container">
			<view class="content">
				<view class="order-status">
					<view bindtap="chooseStatus" class="status">订单{{status}}
						<view class="icon icon-xiangyou1"></view>
					</view>
					<view class="text" v-if="detail.log&&detail.order.delivery_status!=7">{{detail.log.note}}</view>
					<view class="become-time"
						v-if="detail.order.status>=2&&detail.order.status<5&&detail.order.order_type==1">
						<view class="icon icon-timefill"></view>
						配送时间: <view class="time">{{detail.order.delivery_time}}</view>
					</view>
					<view class="order-btn">
						<block v-if="detail.order.is_pay==0&&detail.order.status<5">
							<view bind:tap="onFinishMealPay" class="btn"
								v-if="detail.order.order_type==3&&detail.order.pay_type=='finishMeal'">立即支付</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsPay"
								data-order-id="detail.order.id" data-order-type="takeout"
								data-success-url="`detail?id=${detail.order.id}`" v-else>立即支付
							</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
								:url="`tangshi/pages/table/goods?table_id=${detail.order.table_id}&sid=${detail.order.sid}&order_id=${detail.order.id}`"
								v-if="detail.order.order_type==3">加菜</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
								:url="`/pages/order/op?id=${detail.order.id}`"
								v-if="detail.order.order_type==1&&detail.order.update_order_info_status==1">修改备注等信息
							</view>
						</block>
						<block v-if="detail.order.status==1">
							<view bind:tap="onCancelOrder" class="btn" data-confirm="确定取消订单吗?"
								data-href="`wmall/order/index/cancel?id=${detail.order.id}`"
								data-success-url="`detail?id=${detail.order.id}`" @click="onCancelOrder()">取消订单</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsPost"
								data-href="`wmall/order/index/remind?id=${detail.order.id}`"
								data-success-url="`detail?id=${detail.order.id}`" v-if="detail.order.is_pay==1">催单
							</view>
						</block>
						<block v-else-if="detail.order.status>1&&detail.order.status<5">
							<view bind:tap="onCancelOrder" class="btn" data-confirm="确定取消订单吗?"
								data-href="`wmall/order/index/cancel?id=${detail.order.id}`"
								data-success-url="`detail?id=${detail.order.id}`"
								v-if="detail.order.customer_cancel_status==1" @click="onCancelOrder()">取消订单</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsPost"
								data-href="`wmall/order/index/remind?id=${detail.order.id}`"
								data-success-url="`detail?id=${detail.order.id}`" v-if="detail.order.is_pay==1">催单
							</view>
							<view bind:tap="onJsEvent" class="btn" data-confirm="你确定收到该商家的外卖?" data-event-type="jsPost"
								data-href="`wmall/order/index/end?id=${detail.order.id}`"
								data-success-url="`comment?id=${detail.order.id}`"
								v-if="detail.order.order_type==1&&detail.order.status==4">确认送达</view>
							<view bind:tap="onJsEvent" class="btn" data-confirm="确认已到店自提?" data-event-type="jsPost"
								data-href="`wmall/order/index/end?id=${detail.order.id}`"
								data-success-url="`comment?id=${detail.order.id}`" v-if="detail.order.order_type==2">
								我已提货</view>
							<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
								:url="`tangshi/pages/table/goods?table_id=${detail.order.table_id}&sid=${detail.order.sid}&order_id=${detail.order.id}`"
								v-if="detail.order.order_type==3&&detail.order.is_pay==1&&detail.order.pay_type=='finishMeal'">
								加菜</view>
						</block>
						<block v-else-if="detail.order.status==5">
							<navigator class="btn"
								:url="`../../packagA/pages/store/goods?sid=${detail.order.sid}&order_id=${detail.order.id}`">
								再来一单</navigator>
							<navigator class="btn" :url="`comment?id=${detail.order.id}`"
								v-if="detail.order.is_comment==0">
								{{detail.order.comment_cn}}
							</navigator>
							<view class="btn" style="display:none" v-if="detail.order.is_comment==1">查看评价</view>
						</block>
						<navigator class="btn more" v-else
							:url="`../../packagA/pages/store/goods?sid=${detail.order.sid}&order_id=${detail.order.id}`">
							再来一单</navigator>
						<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
							data-url="`pages/order/address?id=${detail.order.id}`"
							v-if="detail.order.update_address_status==1">修改收货地址</view>
						<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
							data-url="`pages/order/pindanbill?id=${detail.order.id}`"
							v-if="detail.order.data&&detail.order.data.pindan">拼单分账</view>
						<view bind:tap="onJsEvent" class="btn" data-confirm="确定删除该订单吗?" data-event-type="jsPost"
							data-href="wmall/order/index/delete?id=${detail.order.id}" data-success-url="index"
							v-if="detail.can_delete==1">删除订单</view>
						<view bind:tap="onJsEvent" class="btn" data-event-type="jsUrl"
							data-url="`/pages/order/refund?id=${detail.order.id}`" v-if="detail.order.refund_status>0">
							退款详情</view>
					</view>
					<block v-if="detail.order.deliveryer_id>0">
						<view class="divide">
							<view class="divide-line"></view>
						</view>
						<view class="deliveryer-container clearfix">
							<view class="avatar">
								<image :src=detail.deliveryer.avatar></image>
							</view>
							<view class="deliveryer-info">
								<view class="name">
									{{detail.deliveryer.title}}
									<view class="allocation-icon">{{detail.order.delivery_title}}</view>
									<view class="mobile">{{detail.deliveryer.mobile}}</view>
								</view>
								<view class="star hide" style="display: none">
									<view class="appr-score"></view>
									<view class="appr-score"></view>
									<view class="appr-score"></view>
									<view class="appr-score"></view>
									<view class="appr-score"></view>
								</view>
								<view class="deliveryer-divide" style="display: none">
									4.9分
								</view>
							</view>
							<view class="operate">
								<navigator class="hide">
									<view class="reward">
										<view class="icon icon-money"></view>
									</view>
								</navigator>
								<view bind:tap="onCallStoreOrDeliveryer" class="tel" data-type="deliveryer">
									<view class="icon icon-telephone icon-telephone-circle"></view>
								</view>
								<view bind:tap="onJsEvent" class="location" data-event-type="jsUrl"
									:url="`pages/order/map?id=${detail.order.id}`" v-if="detail.show_location">
									<view class="icon icon-zuobiao"></view>
								</view>
							</view>
						</view>
						<view class="divide">
							<view class="divide-line"></view>
						</view>
						<view class="contact flex-lr font-14">
							<view bind:tap="onJsEvent" class="contact-item" data-event-type="jsUrl"
								:url="`plugin/pages/kefu/chat?relation=member2deliveryer&kefuopenid=${detail.deliveryer.token}&orderid=${detail.order.id}`"
								v-if="detail.order.kefu&&detail.order.kefu.deliveryer_status==1">
								<text class="icon icon-wang margin-5-r"></text>
								联系骑手
							</view>
							<view bind:tap="onCallStoreOrDeliveryer" class="contact-item" data-type="deliveryer">
								<text class="icon icon-telephone margin-5-r"></text>
								致电骑手
							</view>
							<view bind:tap="onJsEvent" class="contact-item" data-event-type="jsUrl"
								:url="`pages/order/award?id=${detail.order.id}`"
								v-if="detail.order.show_deliveryer_award">
								<text class="icon icon-recharge margin-5-r"></text>
								打赏骑手
							</view>
						</view>
					</block>
					<view class="yinsihao-baohu-img" v-if="detail.order.data&&detail.order.data.yinsihao_status==1">
						<image src="http://cos.lalawaimai.com/we7_wmall/wxapp/yinsihao_baohu.png"></image>
					</view>
				</view>
				<swiper v-if="detail.slides">
					<swiper-item v-for="item in detail.slides" :key="item.id">
						<image bind:tap="onJsEvent" data-event-type="jsUrl" :url="item.wxapp_link" :src="item.thumb">
						</image>
					</swiper-item>
				</swiper>
				<view class="shop-content">
					<view class="store-name">
						<navigator class="store-left" :url="`/packagA/pages/store/goods?sid=${detail.store.id}`">
							<view class="avatar">
								<image :src="detail.store.logo"></image>
							</view>
							<view class="name">{{detail.store.title}}</view>
							<view class="icon icon-xiangyou1"></view>
						</navigator>
						<view bind:tap="onCallStoreOrDeliveryer" class="icon icon-telephone icon-telephone-circle"
							data-type="store"></view>
					</view>
					<view class="food-list">
						<view class="food-item" v-for="item in detail.goods" :key="item.id">
							<view class="food-item-img">
								<image :src="item.thumb"></image>
							</view>
							<view class="food-item-price">
								<view class="now-price">{{Lang.dollarSign}}{{item.goods_price}}</view>
								<view class="old-price">{{Lang.dollarSign}}{{item.goods_original_price}}</view>
							</view>
							<view class="food-item-info">
								<view class="food-item-name">
									{{item.goods_title}}
								</view>
								<view class="food-item-num">x{{item.goods_num}}</view>
							</view>
						</view>
					</view>
					<view class="order-region-entries">
						<view class="order-region-entry">
							<view class="order-entry-price">{{Lang.dollarSign}}{{detail.order.delivery_fee}}</view>
							<view class="order-entry-name">配送费</view>
						</view>
						<view class="order-region-entry" v-if="detail.order.box_price>0">
							<view class="order-entry-price">{{Lang.dollarSign}}{{detail.order.box_price}}</view>
							<view class="order-entry-name">
								{{detail.order.order_type==3?'餐具费':detail.store.cn.box_price}}
							</view>
						</view>
						<view class="order-region-entry">
							<view class="order-entry-price">{{Lang.dollarSign}}{{detail.order.pack_fee}}</view>
							<view class="order-entry-name">{{detail.store.cn.pack_fee}}</view>
						</view>
						<view class="order-region-entry" v-if="detail.order.person_num>0">
							<view class="order-entry-price">{{detail.order.person_num}}套</view>
							<view class="order-entry-name">餐具数量</view>
						</view>
						<view class="order-region-entry" v-if="detail.order.order_type==3">
							<view class="order-entry-price">{{Lang.dollarSign}}{{detail.order.serve_fee}}</view>
							<view class="order-entry-name">服务费</view>
						</view>
						<view class="order-region-entry" v-if="detail.order.data.extra_fee">
							<view class="order-entry-price">{{Lang.dollarSign}}{{item.fee}}</view>
							<view class="order-entry-name">{{item.name}}</view>
						</view>
						<view class="order-region-entry" v-if="detail.order.data.store_extra_fee">
							<view class="order-entry-price">{{Lang.dollarSign}}{{item.fee}}</view>
							<view class="order-entry-name">{{item.name}}</view>
						</view>
					</view>
					<view class="divide" v-if="detail.activityed">
						<view class="divide-line"></view>
					</view>
					<view class="discount-box">
						<view class="discount" v-for="item in detail.activityed" :key="item.id">
							<view class="discount-name">
								<view class="icon-b">
									<image :src="`/static/img/${item.type}_b.png`"></image>
								</view>
								{{item.name}}
							</view>
							<view class="discount-price">{{item.note}}</view>
						</view>
					</view>
					<view class="divide">
						<view class="divide-line"></view>
					</view>
					<view class="price clearfix">
						<view class="total">
							总计 <view>{{Lang.dollarSign}}{{detail.order.final_fee}}</view>
						</view>
						<view class="discount">
							订单 {{Lang.dollarSign}}{{detail.order.total_fee}}
						</view>
						<view class="discount">
							已优惠 {{Lang.dollarSign}}{{detail.order.discount_fee}}
						</view>
					</view>
					<view class="divide">
						<view class="divide-line"></view>
					</view>
					<view class="contact flex-lr font-14">
						<view bind:tap="onJsEvent" class="contact-item" data-event-type="jsUrl"
							:url="`plugin/pages/kefu/chat?relation=member2clerk&kefuopenid=${detail.order.sid}&kefuunionid=${detail.order.sid}&orderid=${detail.order.id}`"
							v-if="detail.order.kefu&&detail.order.kefu.store_status==1">
							<text class="icon icon-wang margin-5-r"></text>
							联系商家
						</view>
						<view bind:tap="onCallStoreOrDeliveryer" class="contact-item" data-type="store">
							<text class="icon icon-telephone margin-5-r"></text>
							致电商家
						</view>
					</view>
				</view>
				<view class="order" v-if="detail.order.data&&detail.order.data.meal_redpacket">
					<view class="code">
						<view class="text">套餐红包</view>
						<view class="main text-right">{{Lang.dollarSign}}{{detail.order.data.meal_redpacket.fee}}</view>
					</view>
				</view>
				<view class="order" v-if="detail.order.data&&detail.order.data.vipRedpacket">
					<view class="code">
						<view class="text">会员红包</view>
						<view class="main text-right">{{Lang.dollarSign}}{{detail.order.data.vipRedpacket.fee}}</view>
					</view>
				</view>
				<view class="code-qrcode"
					v-if="detail.order.order_type==2&&detail.order.is_pay==1&&detail.order.status<5">
					<canvas canvasId="canvas" style="width: 150px; height: 150px"></canvas>
					<view class="font-14 margin-10-t">核销码：{{detail.order.code}}</view>
					<view class="code-text">请商家扫描二维码或者填写核销码即可消费</view>
				</view>
				<view class="dispatching" v-if="detail.order.order_type==2||detail.order.order_type==1">
					<view class="time clearfix">
						<view class="text" v-if="detail.order.order_type==1">配送时间</view>
						<view class="text" v-if="detail.order.order_type==2">自提时间</view>
						<view class="main">{{detail.order.delivery_day}} {{detail.order.delivery_time}}</view>
					</view>
					<view class="address clearfix">
						<view class="text" v-if="detail.order.order_type==1">配送地址</view>
						<view class="text" v-if="detail.order.order_type==2">自提地址</view>
						<view class="main">
							<block v-if="detail.order.order_type==1">
								<view>{{detail.order.username}}({{detail.order.sex}}){{detail.order.mobile}}</view>
								<view>{{detail.order.address}}</view>
							</block>
							<block v-if="detail.order.order_type==2">
								<view>{{detail.store.title}}</view>
								<view>{{detail.store.address}}</view>
							</block>
						</view>
					</view>
					<view class="server clearfix" v-if="detail.order.order_type==1">
						<view class="text">配送服务</view>
						<view class="main clearfix">
							<view class="allocation-icon" v-if="detail.order.delivery_type==2">
								{{detail.delivery_title}}
							</view>
							<view class="inline" v-if="detail.order.delivery_type==1">由 商家</view>
							<view>提供高品质配送服务</view>
						</view>
					</view>
					<view class="server clearfix" v-if="detail.order.zhunshibao_status>0">
						<view class="text">准时宝</view>
						<view bind:tap="onJsEvent" class="main clearfix" data-event-type="jsUrl"
							:url="`/pages/order/zhunshibao?id=${detail.order.id}`">
							<view>查看准时宝详情</view>
						</view>
					</view>
				</view>
				<view class="order">
					<view class="code">
						<view class="text">平台订单号</view>
						<view class="main">{{detail.order.ordersn}}</view>
					</view>
					<view class="code">
						<view class="text">商户订单号</view>
						<view class="main">#{{detail.order.serial_sn}}</view>
					</view>
					<view class="code" v-if="detail.order.show_code==1">
						<view class="text">取餐码</view>
						<view class="main">{{detail.order.code}}</view>
					</view>
					<view class="time" v-if="detail.order.order_type==3">
						<view class="text">桌台号</view>
						<view class="main">{{detail.order.table.title}}</view>
					</view>
					<block v-if="detail.order.order_type==4">
						<view class="time">
							<view class="text">预定时间</view>
							<view class="main">{{detail.order.reserve_time}}</view>
						</view>
						<view class="time">
							<view class="text">桌台类型</view>
							<view class="main">{{detail.order.table_category.title}}</view>
						</view>
						<view class="time" v-if="detail.order.table_id>0">
							<view class="text">预定桌号</view>
							<view class="main">{{detail.order.table.title}}</view>
						</view>
						<view class="time">
							<view class="text">预定类型</view>
							<view class="main">{{detail.order.reserve_type_cn}}</view>
						</view>
					</block>
					<view class="time" v-if="detail.order.order_type==1">
						<view class="text">配送时间</view>
						<view class="main">{{detail.order.delivery_day}}~{{detail.order.delivery_time}}</view>
					</view>
					<view class="pay-type">
						<view class="text">支付方式</view>
						<view class="main">{{detail.order.pay_type_cn}}</view>
					</view>
					<view class="pay-type" v-if="detail.order.invoice.title">
						<view class="text">发票抬头</view>
						<view class="main">{{detail.order.invoice.title}}</view>
					</view>
					<view class="pay-type" v-if="detail.order.invoice.recognition">
						<view class="text">纳税人识别号</view>
						<view class="main">{{detail.order.invoice.recognition}}</view>
					</view>
					<view class="note">
						<view class="text">订单备注</view>
						<view class="main">{{detail.order.note?detail.order.note:'无'}}</view>
					</view>
					<view bind:tap="onJsEvent" class="copy" data-event-type="jsCopy" data-text="detail.order.ordersn">复制
					</view>
				</view>
			</view>
		</view>
	</view>
</template>
<script>
	import {
		Storage
	} from '@/static/libs/utils.js'
	export default {
		data() {
			return {
				token: '',
				lat: '',
				lng: '',
				detail:'',
				status:'',
				Lang:{
					dollarSign:'￥',
					dollarSignCn:'元'
				},
				showStatus:false,
				onShowSuperredpacket:false,
				zhezhaoShow:false,
				showYinsihao:false,
				id:0,
			}
		},
		onLoad(e) {
			var id = e.id; //订单id
			this.id = id;
			this.token = Storage.get('token');
			this.lng = Storage.get('longitude');
			this.lat = Storage.get('latitude');
			this.$request.get(
				`/waimai_go/app/wxapp.php?i=1&v=undefined&m=we7_wmall&c=entry&do=mobile&ctrl=wmall&ac=order&op=index&ta=detail&from=wxapp&state=${this.token}&id=${id}&forceOauth=1&menufooter=1&scene=1001&lat=${this.lat}&lng=${this.lng}&__lat=${this.lat}&__lng=${this.lng}`
				).then(res => {
					console.log('订单详情', res);
					var o = res.data.message.message;
					this.detail =o;
					this.status =this.detail.order.status_cn;
					// 0 == o.activityed.length && (o.activityed = !1), o.order.final_fee = getStore(o.order
					// 	.final_fee, 2);
					
			})
	    },
		methods: {
		  //取消外卖订单
		  onCancelOrder(){
			  this.token = Storage.get('token');
			  this.$request.post(`/waimai_go/app/wxapp.php?i=1&v=undefined&m=we7_wmall&c=entry&do=mobile&ctrl=wmall&ac=order&op=index&ta=cancel&id=${id}&from=wxapp&state=${this.token}&scene=1001`).then(res=>{
				  console.log(res)
			  })
		  }
		}
	}
</script>

<style lang='scss'>
	page {
		background-color: #f5f5f5;
	}

	.wmOrderDetails {
		.content swiper {
			margin-top: 10px;
			height: 100px;
		}

		.content swiper image {
			width: 100%;
			height: 100%;
		}

		.container .content {
			margin: 10px;
		}

		.container .content .order-status {
			position: relative;
			background-color: #fff;
			text-align: center;
			padding-top: 5px;
		}

		.container .content .order-status .status {
			font-size: 18px;
			font-weight: 700;
			color: #353535;
			padding: 9px 0;
		}

		.container .content .order-status .status .icon {
			display: inline-block;
			font-size: 16px;
			font-weight: 400;
		}

		.container .content .order-status .text {
			color: #8c8c8c;
			font-size: 14px;
			padding-bottom: 9px;
		}

		.container .content .order-status .become-time {
			color: #666;
			font-size: 16px;
		}

		.container .content .order-status .become-time .icon {
			font-size: 16px;
		}

		.container .content .order-status .become-time .time {
			display: inline-block;
			color: #358de0;
		}

		.container .content .order-status .btn.more {
			background-color: #ff2d4b;
			color: #fff;
			border-color: #ff2d4b;
		}

		.container .content .order-status .order-btn {
			padding: 9px 0;
		}

		.container .content .order-status .order-btn .btn {
			margin: 0 5px;
			font-size: 14px;
			padding: 5px;
			width: auto;
			min-width: 85px;
			box-sizing: border-box;
		}

		.btn {
			font-size: 15px;
			border: 1px solid #ccc;
			display: inline-block;
			padding: 11px 0;
			border-radius: 3px;
			width: 85px;
			text-align: center;
			box-sizing: border-box;
		}

		.container .content .order-status .deliveryer-container {
			padding: 10px 15px;
		}

		.container .content .order-status .deliveryer-container .avatar {
			// float: left;
			display: inline-block;
			width: 50px;
			height: 50px;
			border-radius: 100%;
		}

		.container .content .order-status .deliveryer-container .avatar image {
			width: 100%;
			height: 100%;
			border-radius: 100%;
		}

		.clearfix:after,
		.clearfix:before {
			display: table;
			content: "";
		}
        .clearfix:after {
            clear: both;
        }
		.container .content .order-status .deliveryer-container .deliveryer-info {
			display: inline-block;
			// float: left;
			margin-left: 10px;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .name {
			font-size: 14px;
			text-align: left;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .name .mobile {
			color: #999;
			margin-top: 5px;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .name .allocation-icon {
			display: inline-block;
			position: relative;
			height: 15px;
			line-height: 15px;
			padding: 0 6px;
			font-size: 10px;
			font-weight: 400;
			vertical-align: middle;
			margin-left: 5px;
			border-radius: 5px 0 5px 0;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .star {
			text-align: left;
			display: inline-block;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .star .appr-score {
			display: inline-block;
			width: 10px;
			height: 10px;
			// float: left;
			margin-right: 4px;
			background: url(http://cos.lalawaimai.com/we7_wmall/wxapp/newstars.png) no-repeat;
			background-position: 0 0;
			background-size: cover;
		}

		.container .content .order-status .deliveryer-container .deliveryer-info .deliveryer-divide {
			display: inline-block;
			font-size: 14px;
			color: #ff2d4b;
			margin-left: 5px;
			margin-top: 5px;
		}

		.container .content .order-status .deliveryer-container .operate {
			float: right;
			width: 110px;
			height: 100%;
			display: flex;
			align-items: center;
			flex-flow: row nowrap;
			justify-content: flex-end;
		}

		.container .content .order-status .deliveryer-container .operate navigator {
			float: left;
			height: 50px;
			width: 50%;
		}

		.container .content .order-status .deliveryer-container .operate .reward {
			display: inline-block;
			height: 50px;
			width: 50px;
		}

		.container .content .order-status .deliveryer-container .operate .tel {
			display: inline-block;
			height: 50px;
			width: 50px;
			line-height: 50px;
			text-align: right;
		}

		.container .content .order-status .deliveryer-container .operate .location {
			margin-left: 10px;
		}

		.container .content .order-status .deliveryer-container .operate .icon {
			font-size: 16px;
		}

		.container .content .order-status .deliveryer-container .operate .reward .icon {
			font-size: 25px;
		}

		.container .content .order-status .deliveryer-container .operate .location .icon {
			font-size: 28px;
		}

		.container .content .order-status .yinsihao-baohu-img {
			position: absolute;
			top: 0;
			right: 0;
			width: 60px;
			height: 60px;
		}

		.container .content .order-status .yinsihao-baohu-img image {
			width: 100%;
			height: 100%;
			overflow: hidden;
		}

		.container .content .shop-content {
			margin-top: 10px;
			background-color: #fff;
		}

		.container .content .shop-content .store-name {
			padding: 10px 15px;
			overflow: hidden;
			line-height: 30px;
		}

		.container .content .shop-content .store-name .store-left {
			width: 70%;
			float: left;
		}

		.container .content .shop-content .store-name .icon-telephone {
			float: right;
			width: 30px;
			height: 30px;
			line-height: 30px;
			font-size: 13px;
		}

		.container .content .shop-content .store-name .avatar {
			width: 30px;
			height: 30px;
			float: left;
		}

		.container .content .shop-content .store-name .avatar image {
			width: 100%;
			height: 100%;
			border-radius: 50%;
		}

		.container .content .shop-content .store-name .name {
			font-size: 14px;
			max-width: 80%;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			color: #7d7d7d;
			float: left;
			margin: 0 5px;
		}

		.container .content .shop-content .store-name .icon-xiangyou1 {
			line-height: 30px;
			color: #7d7d7d;
			float: left;
		}

		.container .content .shop-content .food-list .food-item {
			padding: 10px;
			background-color: #f8f8f8;
			overflow: hidden;
			margin-bottom: 10px;
		}

		.container .content .shop-content .food-list .food-item:last-child {
			margin-bottom: 0;
		}

		.container .content .shop-content .food-list .food-item .food-item-img {
			display: inline-block;
		    float: left;
			width: 55px;
			height: 55px;
			overflow: hidden;
		}

		.container .content .shop-content .food-list .food-item .food-item-img image {
			width: 100%;
			height: 100%;
		}

		.container .content .shop-content .food-list .food-item .food-item-price {
			float: right;
			display: inline-block;
			line-height: 20px;
		}

		.container .content .shop-content .food-list .food-item .food-item-price .now-price {
			text-align: right;
			font-size: 15px;
			color: #333;
			font-weight: 500;
		}

		.container .content .shop-content .food-list .food-item .food-item-price .old-price {
			text-align: right;
			font-size: 12px;
			color: #999;
			text-decoration: line-through;
		}

		.container .content .shop-content .food-list .food-item .food-item-info {
			margin: 0 55px 0 65px;
		}

		.container .content .shop-content .food-list .food-item .food-item-info .food-item-name {
			line-height: 20px;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-size: 14px;
		}

		.container .content .shop-content .food-list .food-item .food-item-info .food-item-name .tags::before {
			padding: 0 3px;
		}

		.container .content .shop-content .food-list .food-item .food-item-info .food-item-num {
			line-height: 18px;
			color: #999;
			font-size: 12px;
		}

		.container .content .shop-content .order-region-entries {
			margin-left: 15px;
		}

		.container .content .shop-content .order-region-entries .order-region-entry {
			font-size: 14px;
			position: relative;
			color: #2f2f2f;
			overflow: hidden;
			padding-bottom: 5px;
		}

		.container .content .shop-content .order-region-entries .order-region-entry:first-child {
			padding-top: 9px;
		}

		.container .content .shop-content .order-region-entries .order-region-entry:last-child {
			padding-bottom: 9px;
		}

		.container .content .shop-content .order-region-entries .order-region-entry .order-entry-price {
			position: absolute;
			top: 8px;
			right: 15px;
			font-size: 12px;
		}

		.container .content .shop-content .discount-box .discount {
			margin-left: 15px;
			padding: 9px 0;
			line-height: 20px;
		}

		.container .content .shop-content .discount-box .discount .discount-name {
			display: inline-block;
			font-size: 14px;
		}

		.container .content .shop-content .discount-box .discount .discount-name .tags {
			display: inline-block;
			font-size: 14px;
			text-align: center;
		}

		.container .content .shop-content .discount-box .discount .discount-name .tags::before {
			padding: 0 3px;
		}

		.container .content .shop-content .discount-box .discount .discount-price {
			float: right;
			margin-right: 15px;
			display: inline-block;
			font-size: 14px;
			color: #ff2d4b;
		}

		.container .content .shop-content .price {
			padding: 10px 15px;
		}

		.container .content .shop-content .price .total {
			// float: right;
			display: inline-block;
			font-size: 16px;
		}

		.container .content .shop-content .price .total view {
			display: inline-block;
			font-size: 14px;
			font-weight: 700;
			color: #ff4648;
		}

		.container .content .shop-content .price .discount {
			// float: right;
			display: inline-block;
			margin-right: 10px;
			font-size: 15px;
			color: #7d7d7d;
			margin-top: 2px;
		}

		.container .content .shop-content .store-tel {
			text-align: center;
			padding: 10px 15px;
			font-size: 16px;
		}

		.container .content .shop-content .store-tel .icon {
			border: 0;
			width: 30px;
			height: 30px;
			font-size: 16px;
			color: #555;
		}

		.container .content .dispatching {
			padding: 15px;
			background-color: #fff;
			margin-top: 10px;
		}

		.container .content .dispatching .address>view,
		.container .content .dispatching .server>view,
		.container .content .dispatching .time>view {
			float: left;
		}

		.container .content .dispatching .text {
			font-size: 14px;
			color: #9a9a9a;
			margin-right: 15px;
		}

		.container .content .dispatching .time .main {
			font-size: 14px;
		}

		.container .content .dispatching .address {
			margin-top: 15px;
		}

		.container .content .dispatching .address .main {
			font-size: 14px;
			margin-left: 71px;
			float: none;
		}

		.container .content .dispatching .server {
			margin-top: 15px;
		}

		.container .content .dispatching .server .main {
			font-size: 14px;
		}

		.container .content .dispatching .server .main view {
			display: inline-block;
			// float: left;
		}

		.container .content .dispatching .server .main .allocation-icon {
			margin-top: 3px;
		}

		.container .content .dispatching .server .main view:last-child {
			margin-left: 5px;
		}

		.container .content .dispatching .uploadImg-group {
			margin-top: 15px;
			display: flex;
			align-items: center;
		}

		.container .content .dispatching .uploadImg-group .uploadImg-title {
			width: 18%;
			font-size: 14px;
			color: #9a9a9a;
			padding-right: 10px;
		}

		.container .content .dispatching .uploadImg-group .uploadImg-body {
			display: flex;
			align-items: center;
			justify-content: flex-start;
			flex: 1;
		}

		.container .content .dispatching .uploadImg-group .uploadImg-body .img-group {
			width: 33.33%;
			height: 81px;
		}

		.container .content .dispatching .uploadImg-group .uploadImg-body .img-group .img-wrap {
			position: relative;
			width: 100%;
			height: 100%;
			padding-right: 5px;
			box-sizing: border-box;
		}

		.container .content .dispatching .uploadImg-group .uploadImg-body .img-group .img-wrap image {
			width: 100%;
			height: 100%;
		}

		.container .content .order {
			padding: 15px;
			margin-top: 10px;
			background-color: #fff;
			position: relative;
		}

		.container .content .order .code>view,
		.container .content .order .pay-type>view,
		.container .content .order .time>view {
			display: inline-block;
			font-size: 14px;
		}

		.container .content .order .time {
			margin-top: 10px;
		}

		.container .content .order .text {
			color: #9a9a9a;
			margin-right: 15px;
		}

		.container .content .order .note .text {
			font-size: 14px;
			color: #9a9a9a;
			margin-right: 15px;
			float: left;
		}

		.container .content .order .note .main {
			font-size: 14px;
			margin-left: 71px;
			float: none;
		}

		.container .content .order .copy {
			position: absolute;
			right: 15px;
			top: 15px;
			font-size: 12px;
			border: 1px solid #b4b4b4;
			padding: 2px 10px;
			border-radius: 3px;
		}

		.bottom-fixed.close {
			background-color: #ff2d4b;
			color: #fff;
		}

		.pop-container .wui-steps {
			margin: 0 10px;
		}

		.pop-container .wui-steps-title {
			width: 90%;
		}

		.pop-container .time {
			display: inline-block;
			// float: right;
			color: #999;
		}

		.pop-container .explan {
			padding-left: 27px;
			color: #999;
		}

		.icon-b {
			width: 17px;
			height: 17px;
		}

		.container .send-redpacket {
			z-index: 5;
			position: fixed;
			bottom: 150px;
			right: 10px;
			width: 50px;
		}

		.container .send-redpacket image {
			width: 100%;
		}

		.redpacket-dialog {
			display: none;
		}

		.redpacket-dialog.redpacket-dialog-show {
			display: block;
		}

		.redpacket-dialog .dialog-mask {
			position: fixed;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			z-index: 10;
			background-color: rgba(0, 0, 0, .7);
		}

		.redpacket-dialog .dialog-container {
			width: 270px !important;
			position: fixed;
			border-radius: 7px;
			left: 50%;
			top: 50%;
			margin-left: -135px;
			margin-top: -100px;
			background-color: #fff;
			z-index: 11;
		}

		.redpacket-dialog .dialog-container .dialog-inner {
			border-radius: 7px 7px 0 0;
			padding: 15px;
			background-color: #fff;
		}

		.redpacket-dialog .dialog-container .dialog-inner .dialog-inner-text {
			box-sizing: border-box;
			color: #333;
			margin: 0 auto;
			border: none;
			text-align: center;
		}

		.redpacket-dialog .dialog-container .dialog-inner .dialog-inner-text .inner-image {
			width: 120px;
			max-width: 100%;
			display: block;
			margin: 0 auto;
		}

		.redpacket-dialog .dialog-container .dialog-inner .dialog-inner-text .get_repackets_nums {
			color: #333;
			font-weight: 600;
			font-size: 15px;
			display: block;
		}

		.redpacket-dialog .dialog-container .dialog-inner .dialog-inner-text .go-to-share {
			font-size: 14px;
			color: #333;
			display: block;
		}

		.redpacket-dialog .dialog-container .dialog-bottons {
			display: flex;
			height: 50px;
			box-sizing: border-box;
			border-top: 1rpx solid #e0e0e0;
		}

		.redpacket-dialog .dialog-container .dialog-bottons .button-cancel {
			color: #333;
			width: 50%;
			text-align: center;
			display: block;
			height: 50px;
			line-height: 50px;
			font-size: 16px;
			cursor: pointer;
			border-right: 1rpx solid #e0e0e0;
		}

		.redpacket-dialog .dialog-container .dialog-bottons .button-go-redpacket {
			color: #f90;
			width: 50%;
			text-align: center;
			display: block;
			height: 50px;
			line-height: 50px;
			font-size: 16px;
			cursor: pointer;
		}

		.container .content .code-qrcode {
			padding: 15px;
			margin-top: 10px;
			background-color: #fff;
			display: flex;
			flex-flow: column nowrap;
			align-items: center;
			justify-content: center;
			line-height: 1;
		}

		.container .content .code-qrcode .code-text {
			font-size: 14px;
			margin-top: 10px;
			color: #999;
		}

		.container .yinsihao-popup .van-popup {
			text-align: center;
			width: 80%;
			border-radius: 2px;
			box-sizing: border-box;
			line-height: 1;
		}

		.container .yinsihao-popup .van-popup .popup-title {
			display: flex;
			justify-content: center;
			align-items: center;
			padding: 20px 0 15px;
		}

		.container .yinsihao-popup .van-popup .popup-title .yinsihao-img {
			width: 100px;
			height: 100px;
			overflow: hidden;
		}

		.container .yinsihao-popup .van-popup .popup-container .yinsihao-mobile {
			padding-top: 20px;
			font-size: 24px;
			font-weight: 500;
		}

		.container .yinsihao-popup .van-popup .popup-container .yinsihao-tips {
			padding: 25px 0 20px;
			font-size: 14px;
			color: #fed05e;
		}

		.container .yinsihao-popup .van-popup .popup-footer {
			display: flex;
			justify-content: space-between;
			align-items: center;
		}

		.container .yinsihao-popup .van-popup .popup-footer .yinsihao-cancel,
		.container .yinsihao-popup .van-popup .popup-footer .yinsihao-confirm {
			width: 50%;
			text-align: center;
			font-size: 16px;
			font-weight: 500;
			padding: 15px 0;
		}

		.container .yinsihao-popup .van-popup .popup-footer .yinsihao-confirm {
			color: #fed05e;
		}

		.container .contact .contact-item {
			display: flex;
			align-items: center;
			justify-content: center;
			flex: 1;
			padding: 10px 0 15px;
		}

		.container .contact .contact-item:first-child {
			position: relative;
			border-right: 1px dotted #ddd;
		}

		.container .contact .contact-item:first-child:before {
			content: "";
			position: absolute;
			right: -1px;
			top: -6px;
			height: 6px;
			border-right: 1px dotted #ddd;
		}
	}
</style>
